﻿
<div class="bui-page">
    <header class="bui-bar">
        <div class="bui-bar-left"> <a class="bui-btn btn-back"><i class="icon-back"></i></a> </div>
        <div class="bui-bar-main">滑动条</div>
        <div class="bui-bar-right"> </div>
    </header>
    <main>
        <div class="section-title">滑动条</div>
        <ul class="bui-list">
            <li class="bui-btn bui-box">
                <div class="span1">
                    <label>滑动条样式1</label>
                </div>
                <input type="range" class="bui-range" min="0" max="255" value="100">
            </li>
            <li class="bui-btn bui-box">
                <div class="span1">
                    <label>滑动条样式2</label>
                </div>
                <input type="range" class="bui-range success" min="0" max="255" value="130">
            </li>
            <li class="bui-btn bui-box">
                <div class="span1">
                    <label>滑动条样式3</label>
                </div>
                <input type="range" class="bui-range warning" min="0" max="255" value="160">
            </li>
            <li class="bui-btn bui-box">
                <div class="span1">
                    <label>滑动条样式4</label>
                </div>
                <input type="range" class="bui-range danger" min="0" max="255" value="190">
            </li>
        </ul>
    <main>
</div>